<!-- 文件上传下载 -->
<template>
	<div class=" ">
		<input type="file" @change="zx">
		<button @click="submitFile">上传文件</button>
	</div>
</template>

<script>

	import axios from 'axios';


	export default {
		data() {
			return {
				wj: null
			};
		},
		methods: {
			zx(event) {
				// 将上传的文件保存到wj里
				this.wj = event.target.files[0];
			},
			submitFile() {
				if (!this.wj) {
					alert('请选择一个文件');
					return;
				}
				// 背包
				const formData = new FormData();
				// 把用户选择的文件当作一件物品，并且给它贴上 “file” 的标签，然后把它放进 formData 这个大背包里
				formData.append('file', this.wj);

				// 把文件传给后端
				axios({
					url: 'http://localhost:8082/Tpscxz/upload',
					method: "post",
					data: formData,
					// 必须加下面这个
					headers: {
						'Content-Type': 'multipart/form-data'
					}
				}).then(response => {
					let json = response.data;
					if (json.state === 200) {

					} else {
						alert(json.state + " " + json.message)
					}
				}).catch(e => {
					alert(e)
				})
			}
		}
	};
</script>

<style scoped>
	/* 加边框 */
	.jbk {
		border: 1px solid salmon;
	}

	/* 居中 */
	.jz {
		/* 水平居中*/
		align-items: center;
		/* 垂直居中*/
		justify-content: center;

	}

	/* 外边距 */
	.wbj {
		margin: 100px;
	}

	.zt {}
</style>